import './Apply.css'
import {useNavigate} from 'react-router-dom' 
import { useSelector, useDispatch } from 'react-redux'
import { addUser,setCurrentUser } from '../../stores/UserSlice'
import {useState,useEffect,useMemo} from 'react'
import PreferencesAndTaboos from '../../components/Preferences-and-taboos/PreferencesAndTaboos'
import NumberOfVisitors from '../../components/NumberOfVisitors/NumberOfVisitors.jsx'
import Location from '../../components/location/location.jsx'
import StartAndEnd from '../../components/startandend/StartAndEnd.jsx'
import {Button} from 'antd'
import { Steps } from 'antd-mobile'
import {MailFill} from 'antd-mobile-icons'
export default function Apply() {
       const navigate=useNavigate()
 const { users } = useSelector(state => state.user)
    const dispatch = useDispatch()
   const { Step } = Steps
    return (
        <div className='main'>
            <div className='ApplyTop' style={{display:'flex'}}>
                <h3 onClick={()=>navigate(-1)}>&lt;</h3>
                <h2>发起接待申请</h2>
                <h3 style={{ display: 'flex' }}><p>...</p><p onClick={()=>navigate('/layout')}>&times;</p></h3>
            </div>

            <div style={{ display: 'flex' }}>
                 <Steps current={1}>
          <Step title='接待信息'   status='finish' icon={<div className='icon'>1</div>} />
          <Step title='行程安排'   status='wait' icon={<div className='icon' style={{background:'#eee'}}>2</div>} />
        </Steps>
            </div>
            <div className='title' style={{display:'flex',justifyContent:'flex-start'}}>接待信息</div>
            <Location/>
            <StartAndEnd/>
            <NumberOfVisitors />

            <PreferencesAndTaboos
            userData={users}
            />
           <div style={{display:'flex',justifyContent:'center',alignItems:'center'}}>
             <div style={{fontSize:'16px',marginRight:'10px',marginTop:'10px',flexShrink:0}}><p><MailFill/></p><p>存草稿</p></div>
            <Button type="primary"  size='middle' block onClick={()=>{navigate('/conference')}}
                style={{marginTop:'20px'}}
                 >下一步</Button>
           </div>
        </div>
    )
}